<%--
  Created by IntelliJ IDEA.
  User: 11065
  Date: 2021/10/27
  Time: 22:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page import="lombok.var" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>添加车次</title>
</head>
<body><div align="center">
    <a href="/" style="margin-top: 5px;text-align: right"><h4>退出</h4></a>
    <h1>添加车次</h1>
    <form style='font-size:115%'>
    <label>列车号</label>
    <div>
        <input type="text" style="background-color: aliceblue" list="tidlist" id="t_id"/>
        <datalist id="tidlist"> </datalist>
    </div><br><br>
    <label>出发时间</label>
    <div>
        <input type="datetime-local" style="background-color: aliceblue"  name="btime" id="b_time"/>
    </div><br><br>
    <label>到达时间</label>
    <div>
        <input type="datetime-local" style="background-color: aliceblue"  name="etime" id="e_time" />
    </div><br><br>
    <label>起点站</label>
    <div>
        <input type="text"  style="background-color: aliceblue" name="bstation" list="bstation_list" id="b_station"/>
        <datalist id="bstation_list">
            <option>北京</option>
            <option>上海</option>
            <option>十堰</option>
        </datalist>
    </div><br><br>
    <label>终点站</label>
    <div>
        <input type="text"  style="background-color: aliceblue" name="estation" list="estation_list" id="e_station"/>
        <datalist id="estation_list">
            <option>北京</option>
            <option>上海</option>
            <option>十堰</option>
        </datalist>
    </div><br>
    <div>
        <button style="font-size: medium" type="button" onclick="yeah()">确定</button>
        <button style="font-size: medium" type="button" onclick="back()">返回</button>
    </div>
    </form>
</div></body>

<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.4.1.min.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/js/plugins/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script src="/js/plugins/bootstrapValidator/bootstrapValidator.min.js"></script>
<script>
    <%! var 该车次;%>
    function yeah() {
        var 列车号 = $("#t_id").val();
        var 出发时间 = $("#b_time").val();
        var 到达时间 = $("#e_time").val();
        var 起点站 = $("#b_station").val();
        var 终点站 = $("#e_station").val();
        var order = {};
        order.列车号 = 列车号;
        order.出发时间 = 出发时间;
        order.到达时间 = 到达时间;
        order.起点站 = 起点站;
        order.终点站 = 终点站;
        该车次 = order
        $.ajax({
            type: "post",
            url: "add",
            contentType: "application/json; charset=UTF-8",
            // data: {"id":id,"bTime":btime,"eTime":etime,"bStation":bstation,"eStation":estation},
            data: JSON.stringify(该车次),
            dataType: "json",
            success:function (data) {
                if (data.code == 200){
                    alert("添加成功！")
                    //location.reload();
                    window.location='/Order';
                    //window.history.go(-1);
                }else {
                    alert("添加失败！")
                }
            },
            error:function (xhr, textStatus, errorThrown) {
                /*错误信息处理*/
                alert("进入error---");
                alert("状态码："+xhr.status);
                alert("状态:"+xhr.readyState); //当前状态,0-未初始化，1-正在载入，2-已经载入，3-数据进行交互，4-完成。
                alert("错误信息:"+xhr.statusText );
                alert("返回响应信息："+xhr.responseText );//这里是详细的信息
                alert("请求状态："+textStatus);
                alert(errorThrown);
                alert("请求失败");
            }
        })
    }

    function back() {
        window.history.go(-1);
    }
</script>
<canvas id="cas" style="position:absolute; top:0px; left:0px; z-index:-1;"></canvas>
<script>
    var canvas = document.getElementById("cas");
    var ctx = canvas.getContext("2d");
    resize();
    window.onresize = resize;
    function resize() {
        canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
        canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    }
    var RAF = (function() {
        return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(callback) {
            window.setTimeout(callback, 1000 / 60);
        };
    })();
    var warea = {x: null, y: null, max: 20000};
    window.onmousemove = function(e) {
        e = e || window.event;
        warea.x = e.clientX;
        warea.y = e.clientY;
    };
    window.onmouseout = function(e) {
        warea.x = null;
        warea.y = null;
    };
    var dots = [];
    for (var i = 0; i < 350; i++) {
        var x = Math.random() * canvas.width;
        var y = Math.random() * canvas.height;
        var xa = Math.random() * 2 - 1;
        var ya = Math.random() * 2 - 1;
        dots.push({
            x: x,
            y: y,
            xa: xa,
            ya: ya,
            max: 5000
        })
    }
    setTimeout(function() {
        animate();
    }, 100);
    function animate() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        var ndots = [warea].concat(dots);
        dots.forEach(function(dot) {
            dot.x += dot.xa;
            dot.y += dot.ya;
            dot.xa *= (dot.x > canvas.width || dot.x < 0) ? -1 : 1;
            dot.ya *= (dot.y > canvas.height || dot.y < 0) ? -1 : 1;
            ctx.fillRect(dot.x - 0.5, dot.y - 0.5, 1, 1);
            for (var i = 0; i < ndots.length; i++) {
                var d2 = ndots[i];
                if (dot === d2 || d2.x === null || d2.y === null) continue;
                var xc = dot.x - d2.x;
                var yc = dot.y - d2.y;
                var dis = xc * xc + yc * yc;
                var ratio;
                if (dis < d2.max) {
                    if (d2 === warea && dis > (d2.max / 2)) {
                        dot.x -= xc * 0.03;
                        dot.y -= yc * 0.03;
                    }
                    ratio = (d2.max - dis) / d2.max;
                    ctx.beginPath();
                    ctx.lineWidth = ratio / 2;
                    ctx.strokeStyle = 'rgba(0,0,0,' + (ratio + 0.2) + ')';
                    ctx.moveTo(dot.x, dot.y);
                    ctx.lineTo(d2.x, d2.y);
                    ctx.stroke();
                }
            }
            ndots.splice(ndots.indexOf(dot), 1);
        });
        RAF(animate);
    }
</script>
</html>

